/**
 * BottomAppBar+FloatingActionButton自定义布局
 * 
 * 重点在于
 * BottomAppBar的 shape: CircularNotchedRectangle()属性
 * FloatingActionButton的 floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked属性
 */
import 'package:flutter/material.dart';

class BottomAppBarPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("BottomAppBarPage"),
      ),
      bottomNavigationBar: BottomAppBar(
        color: Colors.lightBlue,
        shape: CircularNotchedRectangle(),
        child: Row(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            IconButton(
              icon: Icon(Icons.email),
              color: Colors.white,
              onPressed: () {},
            ),
            IconButton(
              icon: Icon(Icons.near_me),
              color: Colors.white,
              onPressed: () {},
            ),
          ],
        ),
      ),
      floatingActionButton: Builder(
        builder: (context) {
          return FloatingActionButton(
            child: Icon(Icons.add),
            onPressed: () {
              /// 直接弹SnackBar会有问题，context获取不正常，两种解决方法
              /// 1.用GlobKey保存Scaffold的key，用key调用
              /// 2.用Build组件包裹一层，重新build
              // Scaffold.of(context).showSnackBar(SnackBar(
              //   content: Text("hello flutter"),
              // ));
            },
          );
        },
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }
}
